<!DOCTYPE html>
<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript" ></script>
        <link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 5000px), only screen and (max-width: 5000px)"  href="css/main.css" >
        <link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 1600px), only screen and (max-width: 1600px)"  href="css/1600.css" >
        <link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 1280px), only screen and (max-width: 1280px)"  href="css/1280.css" >
        <link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 1024px), only screen and (max-width: 1024px)"  href="css/1024.css" >
        <link rel="stylesheet" type="text/css" media="only handheld and (max-device-width: 1920px), only handheld and (max-width: 1920px)"  href="css/handy_big.css" >
        <link rel="stylesheet" type="text/css" media="only handheld and (max-device-width: 1280px), only handheld and (max-width: 1280px)"  href="css/handy_small.css" >

        <link rel="icon" href="resources/favicon.ico" type="image/x-icon">

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>YouSwap - Share your videos</title>

        <?php
        session_start();
        $_SESSION['sessionCode'] = 'Th5aJ667HJH89-0SHI2jkhjsUGHJ7687SKJ';
        ?>

        <script type="text/javascript" src="utils.js">
        </script>

    </head>
    <body >




        <noscript>
        <p><h3>Javascript is required. Please enable it in your browser settings.</h3></p>
        </noscript>
        <div id="wrapper">
            <div id="headrow">

                <div id="logo">
                    <img src="resources/logo.png">
                </div> <!--logo-->

                <div id="slogan">
                    <img src="resources/slogan.png">
                </div> <!--slogan-->

                <div id="likes">
                    <div class="icon">

                        <!--FACEBOOK BUTTON INCL. SCRIPT-->
                        <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.youswap.tv%2Findex.php&amp;width=100&amp;height=21&amp;colorscheme=light&amp;layout=button_count&amp;action=like&amp;show_faces=true&amp;send=false" 
                                scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:110px; height:21px;" allowTransparency="true"></iframe>
                    </div> <!--icon-->

                    <div class="icon">
                        <!--TWITTER BUTTON INCL SCRIPT-->

                        <a href="https://twitter.com/share" class="twitter-share-button" data-via="VarnishingJamHD" data-lang="de">Twittern</a>
                        <script>!function(d, s, id) {
                                var js, fjs = d.getElementsByTagName(s)[0], p = /^http:/.test(d.location) ? 'http' : 'https';
                                if (!d.getElementById(id))
                                {
                                    js = d.createElement(s);
                                    js.id = id;
                                    js.src = p + '://platform.twitter.com/widgets.js';
                                    fjs.parentNode.insertBefore(js, fjs);
                                }
                            }
                            (document, 'script', 'twitter-wjs');</script>
                    </div> <!--icon-->



                    <!-- Place this tag where you want the +1 button to render. -->
                    <div class="g-plusone" data-size="medium"></div>

                    <!-- Place this tag after the last +1 button tag. -->
                    <script type="text/javascript">
                        window.___gcfg = {lang: 'de'};
                        (function() {
                            var po = document.createElement('script');
                            po.type = 'text/javascript';
                            po.async = true;
                            po.src = 'https://apis.google.com/js/plusone.js';
                            var s = document.getElementsByTagName('script')[0];
                            s.parentNode.insertBefore(po, s);
                        })();
                    </script>

                </div> <!--g-plusone-->



            </div> <!--headrow-->

            <div id="form">
                <form method="POST" action="">
                    <input class="textField" type="text" id="linkToAdd" />

                    <input type="submit" class="button" value="SWAP" BorderThickness="0" />
                </form>

            </div> <!--form-->

            <div id="videoArea">

                <iframe width="1000" height="563" src="//www.youtube.com/embed/TyV-ebnPnGQ" frameborder="0" allowfullscreen></iframe>

            </div> <!--videoArea-->


            <fieldset class="fieldBox" >

                <legend class="fieldBoxLegend">Share</legend>

                <div id="shareBoxLinkText">Link</div>

                <input type="text" class="textFieldLink" id="shareLink" onclick="this.select();" value="http://youtu.be/TyV-ebnPnGQ" readonly />
                <a href="#" 
                   onclick="
                           window.open(
                                   'https://www.facebook.com/sharer/sharer.php?u=' + document.getElementById('shareLink').value,
                                   'facebook-share-dialog',
                                   'width=626,height=436');
                           return false;">
                    <img src="resources/fb_icon.png" width="32px" height="32px" alt="Auf Facebook teilen" class="shareLinkButton">
                </a>

                <a href="#" target="_blank" title="Artikel twittern" onclick="
                        window.open(
                                'http://twitter.com/home?status=' + document.getElementById('shareLink').value);
                        return false;">
                    <img class="shareLinkButton" src="https://abs.twimg.com/a/1381432172/images/resources/twitter-bird-white-on-blue.png" width="32px" height="32px" alt="Auf Twitter teilen"/>
                </a>

                <a href="#" onclick="javascript:window.open('https://plus.google.com/share?url=' + document.getElementById('shareLink').value,
                                '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');
                        return false;">
                    <img class="shareLinkButton" src="https://www.gstatic.com/images/icons/gplus-32.png" alt="Auf Google+ Teilen" width="32px" height="32px"/></a>

            </fieldset>



            <fieldset class="fieldBox">
                <legend class="fieldBoxLegend">
                    Rate
                </legend>

            </fieldset>






            <div id="impressum">

                <a id="credits" href="#" onclick="javascript:window.open('impressum.html',
                                            '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');
                                    return false;">Credits</a>

            </div>


        </div> <!--wrapper-->
    </body>
</html>
